// components/wenda/wenda.js
Component({
  /**
   * 组件的属性列表
   */
  properties: {
    questionId: {
      type: Number,
      value: 0
    }
  },

  /**
   * 组件的初始数据
   */
  data: {
    showModal: false, // 弹窗显示控制
    animation: {}, // 弹窗动画
    inputValue: '', // 输入框内容
    messages: [], // 对话消息列表
    isLoading: false, // 加载状态
    scrollTop: 0, // 滚动位置
    isFirstQuestion: true // 是否为第一次提问
  },

  /**
   * 组件的方法列表
   */
  methods: {
    // 初始化动画
    initAnimation: function () {
      this.animation = wx.createAnimation({
        duration: 300,
        timingFunction: 'ease',
      });
    },

    // 打开弹窗
    openModal: function () {
      this.setData({
        showModal: true,
        isFirstQuestion: true, // 每次打开弹窗都重置为第一次提问
        messages: [] // 每次打开弹窗都清空消息列表
      });

      // 添加弹出动画
      this.animation.translateY(500).step();
      this.setData({
        animation: this.animation.export()
      });

      // 然后回到原位，形成从下往上弹出的效果
      setTimeout(() => {
        this.animation.translateY(0).step();
        this.setData({
          animation: this.animation.export()
        });
      }, 10);
    },

    // 关闭弹窗
    closeModal: function () {
      this.animation.translateY(1000).step();
      this.setData({
        animation: this.animation.export()
      });

      // 动画结束后隐藏弹窗
      setTimeout(() => {
        this.setData({
          showModal: false
        });
      }, 300);
    },

    // 输入框内容变化
    onInputChange: function (e) {
      this.setData({
        inputValue: e.detail.value
      });
    },

    // 发送消息
    sendMessage: function () {
      const message = this.data.inputValue.trim();
      if (!message) {
        wx.showToast({
          title: '请输入问题',
          icon: 'none'
        });
        return;
      }

      this.setData({
        isLoading: true,
        inputValue: ''
      });

      // 添加用户消息
      const userMessage = {
        type: 'user',
        content: message,
        time: this.formatTime(new Date())
      };

      this.setData({
        messages: [...this.data.messages, userMessage]
      }, () => {
        // 滚动到底部显示用户消息
        this.scrollToBottom();
      });

      // 调用AI问答接口
      this.callAIChat(message);
    },

    // 简单的Markdown解析函数 - 处理标题、加粗、换行和图片
    parseMarkdown: function (text) {
      if (!text) return '';

      let parsed = text;

      // 将 ### 标题 转换为 <h3>标题</h3>
      parsed = parsed.replace(/###\s+(.*?)(?=\n|$)/g, '<h3>$1</h3>');

      // 将 **文本** 转换为 <strong style="color: #9b1e23;">文本</strong>
      parsed = parsed.replace(/\*\*(.*?)\*\*/g, '<strong style="color: #9b1e23;">$1</strong>');

      // 将 \n 转换为 <br/>
      parsed = parsed.replace(/\n/g, '<br/>');

      // 为图片标签添加样式，确保100%显示
      parsed = parsed.replace(/<img([^>]+)>/g, '<img$1 style="max-width: 100%; height: auto;" />');
      
      // 处理Markdown格式的图片 ![alt](url)
      parsed = parsed.replace(/!\[(.*?)\]\((.*?)\)/g, '<img src="$2" alt="$1" style="max-width: 100%; height: auto;" />');

      return parsed;
    },

    // 调用AI问答接口
    callAIChat: function (message) {
      const that = this;

      // 创建AI消息对象（用于流式传输）- 直接显示"正在思考中..."
      const aiMessage = {
        type: 'ai',
        content: '正在思考中...',
        parsedContent: '正在思考中...',
        time: that.formatTime(new Date()),
        isStreaming: true // 标记为流式传输中
      };

      // 先将AI消息添加到消息列表
      that.setData({
        messages: [...that.data.messages, aiMessage]
      }, () => {
        // 滚动到底部
        that.scrollToBottom();
      });

      const app = getApp();
      wx.request({
        url: app.globalData.baseUrl + '/frontend/ai/chat',
        method: 'POST',
        header: {
          'Content-Type': 'application/json',
          'token': wx.getStorageSync('userToken') || ''
        },
        timeout: 60000, // 设置60秒超时时间
        data: {
          message: message,
          questionId: this.properties.questionId,
          isFirstQuestion: this.data.isFirstQuestion ? 1 : 0,
          stream: 1 // 启用流式传输
        },
        success: function (res) {
          if (res.data.code === 200) {
            // 模拟流式效果：逐字显示内容
            const fullContent = res.data.data.content || '';
            const messages = that.data.messages;
            const lastIndex = messages.length - 1;

            // 延迟一小段时间后开始显示真实内容（让用户看到"正在思考中..."）
            setTimeout(() => {
              // 模拟逐字显示效果
              let currentIndex = 0;
              const typingInterval = setInterval(() => {
                if (currentIndex < fullContent.length) {
                  const currentContent = fullContent.substring(0, currentIndex + 1);
                  messages[lastIndex] = {
                    ...messages[lastIndex],
                    content: currentContent,
                    parsedContent: that.parseMarkdown(currentContent)
                  };

                  that.setData({
                    messages: messages
                  }, () => {
                    that.scrollToBottom();
                  });

                  currentIndex++;
                } else {
                  clearInterval(typingInterval);

                  // 流式传输完成
                  messages[lastIndex] = {
                    ...messages[lastIndex],
                    isStreaming: false
                  };

                  that.setData({
                    messages: messages,
                    isLoading: false,
                    isFirstQuestion: false
                  }, () => {
                    that.scrollToBottom();
                  });
                }
              }, 50); // 每50毫秒显示一个字
            }, 800); // 延迟800毫秒，让用户看到"正在思考中..."
          } else {
            wx.showToast({
              title: res.data.msg || 'AI服务异常',
              icon: 'none'
            });
            that.setData({
              isLoading: false
            });
          }
        },
        fail: function (err) {
          wx.showToast({
            title: '网络请求失败',
            icon: 'none'
          });
          that.setData({
            isLoading: false
          });
        }
      });
    },

    // 格式化时间
    formatTime: function (date) {
      const hour = date.getHours().toString().padStart(2, '0');
      const minute = date.getMinutes().toString().padStart(2, '0');
      return `${hour}:${minute}`;
    },

    // 滚动到底部
    scrollToBottom: function () {
      setTimeout(() => {
        // 对于scroll-view，直接设置一个足够大的scrollTop值
        this.setData({
          scrollTop: 999999
        })
      }, 100)
    },

    // 清空对话
    clearMessages: function () {
      this.setData({
        messages: []
      });
    },

    // 发表评论到dati页面
    handlePublishComment: function (e) {
      // e.currentTarget.dataset.msg
      const messageIndex = e.currentTarget.dataset.messageIndex;
      const message = this.data.messages[messageIndex];

      if (!message || message.type === 'user') {
        return;
      }

      // 获取评论内容（使用解析后的内容或原始内容）
      const commentContent = message.parsedContent || message.content;
      console.log(commentContent)
      // 触发事件，通知父页面(dati页面)发表评论
      this.triggerEvent('publishComment', {
        content: commentContent,
        messageIndex: messageIndex
      });

      wx.showToast({
        title: '评论发表成功',
        icon: 'success',
        duration: 2000
      });
    }
  },

  /**
   * 组件生命周期
   */
  lifetimes: {
    attached: function () {
      // 组件挂载时初始化动画
      this.initAnimation();
    }
  },

  /**
   * 组件观察器
   */
  observers: {
    'questionId': function (newQuestionId, oldQuestionId) {
      // 当题目ID发生变化时（切换题目），清空对话记录
      if (newQuestionId !== oldQuestionId && oldQuestionId !== undefined) {
        this.clearMessages();
        this.setData({
          isFirstQuestion: true // 重置为第一次提问状态
        });
      }
    }
  },


})